<template>
  <storeDiy ref="storeDiyRef" @save="saveClick"></storeDiy>
</template>
  <script lang="ts">
export default {
  name: "storeDiyPageCreare",
};
</script>
  <script lang="ts" setup>
import { ref, getCurrentInstance, onMounted } from "vue";
import storeDiy from "@/components/diy/index.vue";
import {
  createDiyPage,
  updateDiyPage,
  getDiyPageHome,
} from "@/api/store/diy_page";
import { diyToolsType, Result, ResultError } from "@/types";
import { useRouter } from "vue-router";
const router = useRouter();

const {
  proxy,
  proxy: { $utils },
} = getCurrentInstance() as any;


const saveClick = (diyData: any) => {
  updateDiyPage({
    page_data: diyData,
    id: pageId.value,
  })
    .then((res: Result) => {
      $utils.successMsg(res.message);
      toInit();
      setTimeout(() => {
        proxy?.$refs["storeDiyRef"]?.resetBtn();
      }, 1000);
    })
    .catch((err: ResultError) => {
      $utils.errorMsg(err);
      proxy?.$refs["storeDiyRef"]?.resetBtn();
    });
};

const pageId = ref<number | string>(0);

const pageData = ref<any>([]);

const toInit = () => {
  getDiyPageHome()
    .then((res: Result) => {
      pageId.value = res.data.id;
      // pageData.value = res.data.page_data;
      proxy?.$refs["storeDiyRef"]?.refreshDiyData(false, res.data.page_data);
    })
    .catch((err: ResultError) => {
      $utils.errorMsg(err);
    });
};

onMounted(() => {
  toInit();
});
</script>